<%= turbo_frame_tag endpoint.metadata.name do %>
  <h2 class="text-lg font-bold mb-4"><%= endpoint.metadata.name %></h2>
  <div class="my-4">
    <h4 class="text-sm font-bold text-gray-500 uppercase">Internal URLs</h4>
    <%= render "projects/services/telepresence_guide", cluster: add_on.cluster, url: "#{endpoint.metadata.name}.#{add_on.name}.svc.cluster.local:#{endpoint.spec.ports.first.port}" %>
    <p class="my-2">
      <% endpoint.spec.ports.each do |port| %>
        <% url = "#{endpoint.metadata.name}.#{add_on.name}.svc.cluster.local:#{port.port}" %>
        <div class="cursor-pointer" data-controller="clipboard" data-clipboard-text="<%= url %>">
          <%= url %>
        </div>
        <%= "#{port.protocol}" %>
      <% end %>
    </p>
  </div>
  <div>
    <h4 class="text-sm font-bold text-gray-500 uppercase">External URLs</h4>
    <p>
      <% urls = ingresses.select { |ingress| ingress.spec.rules.any? { |rule| rule.http.paths.any? { |path| path.backend.service.name == endpoint.metadata.name } } }.map { |ingress| ingress.spec.rules.map { |rule| rule.host } }.flatten %>
      <% urls.each do |url| %>
        <div>
          <a href="https://<%= url %>" target="_blank"><%= url %></a>
          <iconify-icon icon="lucide:external-link"></iconify-icon>
        </div>
      <% end %>
    </p>
  </div>
  <div class="card-actions justify-end">
    <%= link_to "Edit Domains", edit_add_on_endpoint_path(add_on, endpoint.metadata.name), class: "btn btn-primary btn-xs" %>
  </div>
<% end %>